<template>
  <a-modal title="商品选择(可通过双击行选择)" width="980px"  :dialog-style="{ top: '10px' }"  :visible="visible" :confirmLoading="loading" :footer="null" @cancel="handleCancel">
    <f-search-form :more='false' @searchHandler='searchHandler'  >
      <f-search-form-item label='商品名称' name='title' style='width: 350px'/>
    </f-search-form>
    <f-table ref="table" rowKey="drugNo" :scroll='{x:800,y:320}' v-if="visible" @dblclick="dblclick" :columns="columns" :multiple="false" :showRadio="true" :params="queryParam" :api="api.bpd.selectTop10HyDrugList"  @onSelectChange="onSelectChange">
     <span slot='drugType' slot-scope='text'>
        <a-tag color='#2db7f5' v-if='text=="ZS"'>招商</a-tag>
        <a-tag v-if='text=="ZY"'>自营</a-tag>
      </span>
    </f-table>
  </a-modal>
</template>
<script>
import api from '../js/api'

export default {
  name: 'SelectHyPolicyDrugsModal',
  props: {},
  data() {
    return {
      api: Object.assign(api, this.api),
      refs: this.$refs,
      loading: false,
      visible: false,
      selectedRowKeys: [],
      selectedRows: [],
      //列表初始化查询参数
      queryParam: {},
      // 表头
      columns: [
        {
          title: '商品名称',
          align: 'center',
          width:'130px',
          ellipsis: true,
          dataIndex: 'drugsName'
        },
        {
          title: '类型',
          align: 'center',
          width:'40px',
          dataIndex: 'drugType',
          scopedSlots: { customRender: "drugType" }
        },
        {
          title: '规格',
          align: 'center',
          width:'150px',
          ellipsis: true,
          dataIndex: 'drugsSpec'
        },
        {
          title: '件容',
          align: 'center',
          width:'50px',
          dataIndex: 'drugJr'
        },
        {
          title: '单位',
          align: 'center',
          width:'40px',
          dataIndex: 'drugUnit'
        },
        {
          title: '生产企业',
          align: 'center',
          width:'120px',
          ellipsis: true,
          dataIndex: 'producersName'
        },
        {
          title: '供货商',
          align: 'center',
          width:'100px',
          ellipsis: true,
          dataIndex: 'supplierName'
        }
      ]
    }
  },
  methods: {
    open(supplierId) {
      if (supplierId) {
        this.queryParam.supplierId = supplierId
      }
      this.visible = true
      this.selectedRowKeys = []
      this.selectedRows = []
    },
    close() {
      this.$emit('close')
      this.visible = false
    },
    dblclick(record,event){
      let selectedRowKeys=[];
      let selectedRows=[];
      selectedRowKeys.push(record.drugsId);
      selectedRows.push(record);
      this.$emit('drugsSelectChange', selectedRowKeys, selectedRows)
      this.close()
    },
    handleCancel() {
      this.close()
    },
    handleSubmit() {
      this.$emit('drugsSelectChange', this.selectedRowKeys, this.selectedRows)
      this.close()
    },
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
    }
  },
  created() {
  },
  components: {}
}
</script>

<style scoped lang="less" rel="stylesheet/less">

</style>
